<template>
  <div id="supplierReview">
    <h3>您现在正在做的功能是:用户管理-供应商审核</h3>
    <!--查询表单-->
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item >供应商审核</el-breadcrumb-item>
    </el-breadcrumb><br>
    <el-form :inline="true" :model="supplierInfoObj">

      <el-form-item label="公司名称:" >
    <el-input placeholder="请输入公司名称" v-model="supplierInfoObj.companyName">
    </el-input>
    </el-form-item>

    <el-form-item label="代表人名称:" >
      <el-input placeholder="请输入代表人名字" v-model="supplierInfoObj.name">
      </el-input>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="selBtn">查询</el-button>
    </el-form-item>
    </el-form>
    <el-table :data="supplierInfoAry" style="width: 100%">
      <el-table-column
          prop="supplierId"
          label="供货商编号"
          width="180">
      </el-table-column>
      <el-table-column
          prop="companyName"
          label="公司名称"
          width="180">
      </el-table-column>
      <el-table-column
          prop="name"
          label="法定代表人姓名"
          width="180">
      </el-table-column>
      <el-table-column
          prop="phone"
          label="手机号码"
          width="180">
      </el-table-column>
      <el-table-column
          prop="address"
          label="公司地址"
          width="180">
      </el-table-column>
      <el-table-column
          prop="detailAddress"
          label="详细地址"
          width="180">
      </el-table-column>
      <el-table-column
          prop="checkTag"
          label="审核状态"
          width="180">
        <template slot-scope="scope">
          <span v-if="scope.row.checkTag=='S001-1'">等待审核</span>
          <span v-if="scope.row.checkTag=='S001-2'">审核不通过</span>
          <span v-if="scope.row.checkTag=='S001-3'">审核通过</span>
        </template>
      </el-table-column>
      <!--操作列-->
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button
              size="mini"
              type="success"
              round
              icon="el-icon-edit"
              @click="checkSup(scope.row)" plain>审核</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="pageNo"
        :page-sizes="pageSizeList"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total">
    </el-pagination>

    <!--供应商复核-->
    <el-dialog title="查看供货商详细信息" :visible.sync="checkVisible">
      <el-form ref="form" :model="supplierInfoObj1" label-width="200px">
        <el-form-item label="供货商编号" >
          <el-input v-model="supplierInfoObj1.supplierId"></el-input>
        </el-form-item>
        <el-form-item label="关联前台编号" :label-width="formLabelWidth">
          <el-input v-model="supplierInfoObj1.sysUsersId"></el-input>
        </el-form-item>
        <el-form-item label="账户余额" :label-width="formLabelWidth">
          <el-input v-model="supplierInfoObj1.balance"></el-input>
        </el-form-item>
        <el-form-item label="公司名称" :label-width="formLabelWidth">
          <el-input v-model="supplierInfoObj1.companyName"></el-input>
        </el-form-item>
        <el-form-item label="法定代表人" :label-width="formLabelWidth">
          <el-input v-model="supplierInfoObj1.name"></el-input>
        </el-form-item>
        <el-form-item label="手机号码" :label-width="formLabelWidth">
          <el-input v-model="supplierInfoObj1.phone"></el-input>
        </el-form-item>
        <el-form-item label="营业执照" :label-width="formLabelWidth">
          <el-input v-model="supplierInfoObj1.licenseLink"></el-input>
        </el-form-item>
        <el-form-item label="公司地址" :label-width="formLabelWidth">
          <el-input v-model="supplierInfoObj1.address">
          </el-input>
        </el-form-item>
        <el-form-item label="详细地址" :label-width="formLabelWidth">
          <el-input v-model="supplierInfoObj1.detailAddress">
          </el-input>
        </el-form-item>
        <el-form-item label="申请时间" :label-width="formLabelWidth">
          <el-date-picker
              v-model="supplierInfoObj1.createDate"
              type="datetime"
              placeholder="选择日期" value-format="yyyy-MM-dd HH:mm:ss">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="审核人" :label-width="formLabelWidth">
          <el-input v-model="supplierInfoObj1.checker"></el-input>
        </el-form-item>
        <el-form-item label="审核时间" :label-width="formLabelWidth">
          <el-date-picker
              v-model="supplierInfoObj1.checkerTime"
              type="datetime"
              placeholder="选择日期" value-format="yyyy-MM-dd HH:mm:ss">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="审核理由" :label-width="formLabelWidth">
          <el-input v-model="supplierInfoObj1.checkReason"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="checkNoOk">审核不通过</el-button>
        <el-button type="primary" @click="checkOk">审核通过</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "SupplierReview",
  data() {
    return {
      supplierInfoObj1:{
      },
      supplierInfoAry: {},
      // 当前页号
      pageNo: 1,
      // 当前页大小
      pageSize: 5,
      // 总记录数
      total: 0,
      // 页大小列表
      pageSizeList: [2, 5, 10, 20],
      // 查询条件对象
      supplierInfo: {},
      checkVisible:false,
      supplierInfoObj: {
        name: "",
        shopName: "",
      },
    }
  },
  methods:{
    // 表单查询
    supplierInfo() {
      // 查询
      this.pageNo = 1
      this.supplierInfoPage()
    },
    // 页大小改变
    handleSizeChange(val) {
      this.pageSize = val
      this.supplierInfoPage()
    },
    // 页号改变
    handleCurrentChange(val) {
      this.pageNo = val
      // 重新查询
      this.supplierInfoPage()
    },
    //分页查询所有未审核的信息
    async supplierInfoPage() {
      // 用es6的解构函数
      const {data: res} = await this.$http.post
      (`/supplierInfo/supplierInfoPage/${this.pageNo}/${this.pageSize}`, this.supplierInfoObj)
      console.log('res', res)
      this.supplierInfoAry = res.rows
      this.total = res.total
    },
    async checkSup(rows){
      //显示对话框
      this.checkVisible = true
      this.supplierInfoObj1=rows
    },
    //复核成功
    async checkOk(){
      const {data: res}=await this.$http.post(`/supplierInfo/supplierInfoFuHeOk`,this.supplierInfoObj1)
      this.id=this.supplierInfoObj1.sysUsersId
      console.log(this.id)
      const{data:resa}=await  this.$http.post(`/sysUsers/supplierInfoById/${this.id}`)
      //关闭对话框
      this.checkVisible = false
      // 消息提示
      this.$message('复核成功')
      // 刷新表格
      this.supplierInfoPage()
    },
    //复核失败
    async checkNoOk(){
      const {data: res}=await this.$http.post(`/supplierInfo/supplierInfoFuHeNoOk`,this.supplierInfoObj1)
      //关闭对话框
      this.checkVisible = false
      // 消息提示
      this.$message('复核不成功')
      // 刷新表格
      this.supplierInfoPage()
    },
    selBtn() {
      this.supplierInfoPage()
    },
  },
  mounted() {
    this.supplierInfoPage()
  }
}
</script>

<style scoped>

</style>